var vm = new Vue({
	el:'#rrapp',
	data:{
	    q:{
            searchName: null,
            sidx: null,
            order: null
        },
        page:{total:0,limit:30,page:1},
        dataList:[],
        isadd: false,
		showList: true,
		showView: false,
		title: null,
        addFlag: false,
        editFlag: false,
		fsmsTemplate: {},
        cavnenIds: null,
        columnsList: [
          {name: '模板名称', field: 'templateName' , isShow: true},
          {name: '模板类别', field: 'templateType' , isShow: true},
          {name: '区块数', field: 'canvasNum' , isShow: true},
          {name: 'API标识', field: 'apiFlag' , isShow: true},
        ],
        templateTypeList: [
        {'value': 1, 'text': '系统内置'},
        {'value': 2, 'text': '厂家定义'}
        ],
        templateTypeMap: {},
        templateTypeSearchList: {},
        apiFlagList: [
        {'value': 1, 'text': '支持API'},
        {'value': 2, 'text': '不支持API'}
        ],
        apiFlagMap: {},
        apiFlagSearchList: {},
        canvasNumList:[
            {'value': 1, 'text': '1个区块'},
            {'value': 2, 'text': '2个区块'},
            {'value': 3, 'text': '3个区块'},
            {'value': 4, 'text': '4个区块'},
            {'value': 5, 'text': '5个区块'},
            {'value': 6, 'text': '6个区块'}
        ],
        canvasNumMap:{},
        contentFlagList: [
            {'value': 1, 'text': '模板提供'},
            {'value': 2, 'text': '发送时提供'}
        ],
        contentFlagMap:{},
        canvasTypeList: [
            {'value': 1, 'text': '视频'},
            {'value': 2, 'text': '图片'},
            {'value': 3, 'text': '文本'}
        ],
        canvasTypeMap:{},
        fsmsTemplateCanvas:{},
        activeNum:-1,
		rules: {
          test:[]
       }
	},
    mounted: function () {
        this.templateTypeMap = list2Map(this.templateTypeList)
        this.canvasNumMap = list2Map(this.canvasNumList)
        this.canvasTypeMap = list2Map(this.canvasTypeList)
        this.contentFlagMap = list2Map(this.contentFlagList)
        this.apiFlagMap = list2Map(this.apiFlagList)
        this.getDataList();

        $(".sortable-list").sortable({
            connectWith: ".connectList"
        }).disableSelection();
    },
	methods: {
        test: function () {
            vm.cavnenIds = $(".sortable-list" ).sortable( "toArray", { key: "id" } );
        },
        itemClick: function (item,index) {
            vm.activeNum = index;
            vm.fsmsTemplateCanvas = item;
        },
		query: function () {
			vm.reload();
		},
        getDataList:function () {
            this.q.page = this.page.page;
            this.q.limit = this.page.limit;

            $.ajax({
                type: "POST",
                url: "../fsmstemplate/list",
                data: JSON.stringify(this.q),
                success: function (r) {
                    if (r.code == 0) {
                        //debugger;
                        vm.dataList = r.data.list;
                        vm.page.total = r.data.totalCount;
                    } else {
                        toastr.error(r.message);
                    }
                }
            });
        },
		add: function(){
		    vm.isadd = true; 
			vm.showList = false;
			vm.showView = false;
			vm.title = "新增";
            vm.activeNum = -1;
			vm.fsmsTemplate = {};
            vm.fsmsTemplate.templateType = 1;
            vm.fsmsTemplate.apiFlag = 1;
            vm.fsmsTemplate.canvasNum = 2;
            vm.fsmsTemplate.cavnenList = [
                {canvasId:-1,canvasType:1,canvasSort:1,content:'',contentFlag:2},
                {canvasId:-2,canvasType:3,canvasSort:2,content:'',contentFlag:2},
                {canvasId:-3,canvasType:1,canvasSort:3,content:'',contentFlag:2},
                {canvasId:-4,canvasType:1,canvasSort:4,content:'',contentFlag:2},
                {canvasId:-5,canvasType:1,canvasSort:5,content:'',contentFlag:2},
                {canvasId:-6,canvasType:1,canvasSort:6,content:'',contentFlag:2}
            ]
		},
		update: function (templateId) {
			if(templateId == null){
				return ;
			}
			vm.showList = false;
			vm.showView = false;
            vm.title = "修改";
            vm.activeNum = -1;
            vm.getInfo(templateId)
		},
        view2update: function () {
            vm.showList = false;
            vm.showView = false;
            vm.title = "修改";
        },
		view: function(templateId){
        		vm.title = "查看";
	        vm.getInfo(templateId)
	        	vm.showList = false;
	        	vm.showView = true;
        },
        changeToUpdate:function(){
            vm.showView = false;
        },
        list2Map:function (list) {
            var obj = {}
            for (var i = 0, len = list.length; i < len; i++) {
                obj[list[i].canvasId] = list[i]
            }
            return obj
        },
		saveOrUpadateValid:function (valid){

            debugger;

            var listmap = vm.list2Map(vm.fsmsTemplate.cavnenList)

            var cavnenIds = $(".sortable-list" ).sortable( "toArray", { key: "id" } );

            var cavnenList = [];

            for (var i = 0; i < cavnenIds.length; i++){
                var cavnen = listmap[cavnenIds[i]];
                cavnen.canvasSort = i + 1;
                cavnenList.push(cavnen);
            }

            vm.fsmsTemplate.cavnenList = cavnenList;

            if (valid) {
                var url = vm.isadd ? "../fsmstemplate/save" : "../fsmstemplate/update";
                $.ajax({
				type: "POST",
			    url: url,
			    data: JSON.stringify(vm.fsmsTemplate),
			    success: function(r){
			    	if(r.code === 0){
                        vm.fsmsTemplate = {};
						alert('操作成功', function(index){

							vm.reload();
						});
					}else{
						alert(r.message);
					}
				}
			});
            }else{
                alert('验证未通过');
            }
        },
		saveOrUpdate: function (event) {
			this.$refs['fsmsTemplateForm'].validate(vm.saveOrUpadateValid);
		},
		del: function (templateIds) {

			if(templateIds == null){
				return ;
			}
			
			confirm('确定要删除选中的记录？', function(){
				$.ajax({
					type: "POST",
				    url: "../fsmstemplate/delete",
				    data: JSON.stringify(templateIds),
				    success: function(r){
						if(r.code == 0){
                            alert('删除成功', function(index){
                                vm.reload();
                            });
						}else{
							alert(r.message);
						}
					}
				});
			});
		},
		delOne: function (templateId) {

            var templateIds = [];
            templateIds[0] = templateId;

        	confirm('确定要删除该记录？', function(){
        		$.ajax({
        			type: "GET",
        			url: "../fsmstemplate/delete/"+templateId,
        			success: function(r){
                        if(r.code == 0){
                            alert('删除成功', function(index){
                                vm.reload();
                            });
                        }else{
                            alert(r.message);
                        }
        			}
        		});
        	});
        },
		getInfo: function(templateId){
			$.get("../fsmstemplate/info/"+templateId, function(r){
                vm.fsmsTemplate = r.data;
                debugger;

                if(vm.fsmsTemplate.cavnenList == null)
                {
                    vm.fsmsTemplate.cavnenList = [
                        {canvasId:1,canvasType:1,canvasSort:1,content:'',contentFlag:2},
                        {canvasId:2,canvasType:1,canvasSort:2,content:'',contentFlag:2},
                        {canvasId:3,canvasType:1,canvasSort:3,content:'',contentFlag:2},
                        {canvasId:4,canvasType:1,canvasSort:4,content:'',contentFlag:2},
                        {canvasId:5,canvasType:1,canvasSort:5,content:'',contentFlag:2},
                        {canvasId:6,canvasType:1,canvasSort:6,content:'',contentFlag:2}
                    ]
                }

                if(vm.fsmsTemplate.cavnenList.length < 6)
                {
                    for (var i = vm.fsmsTemplate.cavnenList.length;  i < 6;  i++) {
                        var obj = {canvasId:1,canvasType:1,canvasSort:1,content:'',contentFlag:2};
                        obj.canvasId = -(i+1);
                        obj.canvasSort = i+1;
                        vm.fsmsTemplate.cavnenList.push(obj);
                    }
                }

            });
		},
        handleCommand:function (commond) {
            if(commond=='d')
            {
                location.href = "../fsmstemplate/download?query=" + escape(JSON.stringify(vm.q));
                return;
            }

            if(vm.total>5000)
            {
                toastr.error("导出数据条数不能超过5000条,请用sql从数据库导出!");
                return;
            }

            if(commond=='a')
            {
                $("#data").tableExport({type:'csv'},'data');
                return;
            }

            if(commond=='b')
            {
                $("#data").tableExport({type:'txt'},'data');
                return;
            }

            if(commond=='c')
            {
                $("#data").tableExport({type:'excel',escape:false,
                    mso: {fileFormat:'xlsx',
                        excelstyles: ['border-bottom', 'border-top', 'border-left', 'border-right'],
                        worksheetName: ['Data']}},'data');
                return;
            }
        },
        exportExl: function () {
            if(vm.total>5000)
            {
                toastr.error("导出数据条数不能超过5000条,请用sql从数据库导出!");
                return;
            }

            if(vm.total>5000)
            {
                toastr.error("导出数据条数不能超过5000条,请用sql从数据库导出!");
                return;
            }

            $("#data").tableExport({type:'excel',escape:false,
                mso: {fileFormat:'xlsx',
                    excelstyles: ['border-bottom', 'border-top', 'border-left', 'border-right'],
                    worksheetName: ['Data']}},'data');

        },

        pageSizeChange:function (pageSize) {
            this.page.limit = pageSize;
            this.reload();
        },
        pageCurrentChange:function (page) {
            this.page.page = page;
            this.reload();
        },
        pageChange:function () {
            this.reload();
        },
		reload: function (event) {
			this.isadd = false;
			this.showList = true;
            this.getDataList();
		}
	}
});
